<!--
 * @Author: coocase
 * @Date: 2021-03-11 13:13:35
 * @LastEditTime: 2021-06-11 12:20:41
 * @LastEditors: coocase
 * @Description: 
 * @FilePath: \git\dami\src\App.vue
-->
<template>
    
    <div id="app">
        <!-- router渲染出口 -->
        <!-- 绑定属性 传递给子组件 -->
        <top class="top" :userName="name"></top>
        
        <!--  <div class="wrapper"> -->
            <!-- <search v-on:getResults="getResults" ></search> -->
        <!-- </div> -->

        <!-- 绑定监听方法，监听子组件 获取index的userName      绑定数据给子组件-->
        <!-- 前一个是监听的子组件的方法，后一个是返回参数处理的方法 -->
        <!-- <router-view v-on:indexName="indexName" :results = 'results'></router-view> --> 
         <router-view v-on:indexName="indexName" @getBuyInfo='getBuyInfo' ></router-view>
        
        <BackTop></BackTop>
    </div>
    
</template>

<script>
import Top from "@/components/header";
import Main from "@/pages/index/main";


export default {
    name: "App",
    components: {
        Top,
        Main,
    },
    data() {
        return {
            name: "",
            results:''
        };
    },
    beforeCreate: function () {
    this.$Spin.show();
  },
    updated:function(){
        
    },
    methods: {
        //监听子组件的方法 参数为子组件传的值
        indexName: function (val) {
            this.name = val;
            console.log('app name')
        },
        //监听子组件的方法 参数为子组件传的值
        getResults:function (val) {  
            this.results = val;
            // console.log(val);
            // console.log(this.results);
            // console.log("emited");
            
        },
       getBuyInfo:function () {  
            this.$emit('getBuyInfo',1)
        }
    },
};
</script>

<style>
* {
    margin: 0;
    padding: 0;
    text-decoration-style: none;
}
html,body{
    height: 100%;
}
#app{
    height: 100%;
}
.icon {
  width: 1em;
  height: 1em;
  vertical-align: -0.15em;
  fill: currentColor;
  overflow: hidden;
}
</style>
<style scoped>
.wrapper {
    display: flex;
    justify-content: center;
    align-items: center;
}
</style>
